<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>nalijepiME</title>
	<style type="text/css">
		body {
			background-color: #f4f4f4;
		}
    </style>
	
<script src="http://code.jquery.com/jquery-latest.js"></script>
	<link href="css/layout.css" rel="stylesheet" type="text/css" />

	<script type="text/javascript" src="js/jquery-contained-sticky-scroll.js"></script>
	<script>
		
		jQuery(document).ready(function(){
			jQuery('#menu').containedStickyScroll({
				duration: 0,
				unstick: true,
				closeChar: ''
			});
			
			//box za LOGIN!
			$('#buttonLogIn a').click(function() {
			
			//Getting the variable's value from a link 
			var loginBox = $(this).attr('href');
		
			//Fade in the Popup
			$(loginBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(loginBox).height() + 24) / 2; 
			var popMargLeft = ($(loginBox).width() + 24) / 2; 
			
			$(loginBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .login-popup').fadeOut(300 , function() {
				$('#mask').remove();
			}); 
			return false;
			});
		

		});		
		jQuery(window).scroll(function() {
			var scrollPosition = jQuery(window).scrollTop();
			jQuery("#smetalo").css("top", (scrollPosition+150 ) + "px");
		});
		
		
	</script>
	
	<script>
	//box za REGISTRIRAJ SE
	jQuery(document).ready(function(){
				
			$('#buttonRegister a').click(function() {
			
			//Getting the variable's value from a link 
			var registerBox = $(this).attr('href');
		
			//Fade in the Popup
			$(registerBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(registerBox).height() + 24) / 2; 
			var popMargLeft = ($(registerBox).width() + 24) / 2; 
			
			$(registerBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .register-popup').fadeOut(300 , function() {
				$('#mask').remove();  
			}); 
			
			return false;
			});		
			
	});	
	
	
	
	</script>
	
		<script>
	//box za registraciju vlasnika automobila
	jQuery(document).ready(function(){
				
			$('#vlasnik a').click(function() {
			
			
			//Getting the variable's value from a link 
			var vlasnikBox = $(this).attr('href');
		
			//Fade in the Popup
			$(vlasnikBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(vlasnikBox).height() + 25) / 2; 
			var popMargLeft = ($(vlasnikBox).width() + 25) / 2; 
			
			$(vlasnikBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .vlasnik-popup').fadeOut(300 , function() {
				$('#mask').remove();  
			}); 
			return false;
			});
			
			
	});	
	
	
	
	</script>
	
	<script>
	//box za registraciju vlasnika firme
	jQuery(document).ready(function(){
				
			$('#vlasnikTvrtke a').click(function() {
			
			
			//Getting the variable's value from a link 
			var tvrtkaBox = $(this).attr('href');
		
			//Fade in the Popup
			$(tvrtkaBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(tvrtkaBox).height() + 25) / 2; 
			var popMargLeft = ($(tvrtkaBox).width() + 25) / 2; 
			
			$(tvrtkaBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .tvrtka-popup').fadeOut(300 , function() {
				$('#mask').remove();  
			}); 
			return false;
			});
			
			
	});	
	
	//box za kontaktiranje
	jQuery(document).ready(function(){
				
			$('#kontakt a').click(function() {
			
			
			//Getting the variable's value from a link 
			var kontaktBox = $(this).attr('href');
		
			//Fade in the Popup
			$(kontaktBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(kontaktBox).height() + 25) / 2; 
			var popMargLeft = ($(kontaktBox).width() + 25) / 2; 
			
			$(kontaktBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .kontakt-popup').fadeOut(300 , function() {
				$('#mask').remove();  
			}); 
			return false;
			});
			
			
	});	
	
	
	</script>
	
	<script>
	//box za span REGISTRIRAJ SE
	jQuery(document).ready(function(){
				
			$('#registriraj a').click(function() {
			
			//Getting the variable's value from a link 
			var registerBox = $(this).attr('href');
		
			//Fade in the Popup
			$(registerBox).fadeIn(300);
			
			//Set the center alignment padding + border see css style
			var popMargTop = ($(registerBox).height() + 24) / 2; 
			var popMargLeft = ($(registerBox).width() + 24) / 2; 
			
			$(registerBox).css({ 
				'margin-top' : -popMargTop,
				'margin-left' : -popMargLeft
			});
			
			// Add the mask to body
			$('body').append('<div id="mask"></div>');
			$('#mask').fadeIn(300);
			
			return false;
			
			
		});
		
		// When clicking on the button close or the mask layer the popup closed
		$('a.close, #mask').live('click', function() { 
			  $('#mask , .register-popup').fadeOut(300 , function() {
				$('#mask').remove();  
			}); 
			
			return false;
			});		
			
	});	
	
	
	
	</script>
	
		
</head>

<body>
<div id="login-box" class="login-popup">
          <form method="post" class="signin" action="#">
                <fieldset class="textbox">
            	<label class="username">
                <span>Email</span>
                <input id="username" name="username" value="" type="text" autocomplete="on" placeholder="Email">
                </label>
                <label class="password">
                <span>Lozinka</span>
                <input id="password" name="password" value="" type="password" placeholder="Lozinka">
                </label>
                <button class="submit button" type="button" id="signInButton">Prijavi se</button>
                <p>
                <a class="forgot" href="#">Zaboravili ste lozinku?</a>
                </p>        
                </fieldset>
          </form>
</div>

<div id="register-box" class="register-popup">
          <form method="post" class="register" action="#">
                <fieldset class="textbox">
				<div id = "vlasnik">
					<a href ="#vlasnik-box" id="vlasnik"> Registriraj se kao vlasnik automobila na kojem će biti reklama<br/><br/>
					</a>
				</div>
					
				<div id ="vlasnikTvrtke">	
					<a href ="#tvrtka-box">Registriraj se kao vlasnik tvrtke
					</a>
				</div>
				</fieldset>         
          </form>
</div>


<div id="vlasnik-box" class="vlasnik-popup">
          <form method="post" class="vlasnik" action="#">
                <fieldset class="textbox">
            	<label class="username">
                <span>Ime</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>Prezime</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>e - mail</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>Broj telefona</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
             
                <button class="submit button" type="button" id="signInButton">Registriraj se</button>
                <p>
                <a class="forgot" href="#">Uvjeti korištenja</a>
                </p>        
                </fieldset>
          </form>
</div>

<div id="tvrtka-box" class="tvrtka-popup">
          <form method="post" class="tvrtka" action="#">
                <fieldset class="textbox">
            	<label class="username">
                <span>Naziv tvrtke</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>Adresa</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>e - mail</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
				
				<label class="username">
                <span>Broj telefona</span>
                <input id="username" name="username" value="" type="text" autocomplete="on">
                </label>
             
                <button class="submit button" type="button" id="signInButton">Registriraj se</button>
                <p>
                <a class="forgot" href="#">Uvjeti korištenja</a>
                </p>        
                </fieldset>
          </form>
</div>

<div id="kontakt-box" class="kontakt-popup">
          <form method="post" class="kontakt" action="#">
                <fieldset class="textbox">
            	<label class="username">
                <span>Tvoj email</span>
                <input id="username" name="username" value="" type="text" autocomplete="on" >
                </label>
				
				<label class="username">
                <span>Tema</span>
                <input id="username" name="username" value="" type="text">
                </label>
				
				</fieldset>
				
				 <fieldset class="textbox2">
				
				<label class="username">
                <span>Upit</span>
                <input id="username" name="username" value="" type="text" >
                </label>
				
				</fieldset>
                
                <button class="submit button" type="button" id="signInButton">Pošalji upit</button>
                    
                
          </form>
</div>


	<div id="headerPozadina">
		<div id="smetalo">
			<img src="images/fc-webicon-facebook-m.png"/>
			<img src="images/fc-webicon-googleplus-m.png"/>
			<img src="images/fc-webicon-twitter-m.png"/>
		</div>
		
		<div id="header">
			<div id="logo">
				<img name="" src="images/logoSlika.png" width="283" height="120" alt="" />
			</div>
		</div>
	</div>
	
	<div id="mainBodyDevide">
	</div>
	
	<div id="mainBody">
		<div id="menu">
			<div id="firstPage" href=""></div>
			<a id="page" href="http://www.24sata.hr">Početna</a>
			<div id="divide">|</div>
			<a id="page" href=""> Oglasi</a>
			<div id="divide">|</div>
			<a id="page" href="">Kontakt</a>
			<div id="divide">|</div>
			<a id="page" href="">O nama</a>
			<div id="firstPage"></div>
		</div>
		
		<div id = "devideMenu">
		<div id="buttonRegister">
			<a href = "#register-box">
				Registriraj se
			</a>
		</div>
		<div id="buttonLogIn">
			<a href="#login-box">
				Prijavi se
			</a>
		</div>
		
		</div>
		
		<div id="mainContent">
			<div id="slikaAuta">
				<img src="images/mercedes.png" width="400" height="250" alt="" />
			</div>
			
			<div id="textDesno">
				<h1>Trebaš lovu ili bolju reklamu?</h1>
				<p>Možda nije ovakav kao na slici, ali stoji na super mjestu?
				Imaš auto koji stoji na super lokaciji kojom prolazi puno ljudi dnevno? Misliš da bi mogao pronaći sponzora koji 
				je zainteresiran platiti reklamu na tvom autu? Ovo je pravo mjesto za tebe! 
				Ostavi opis svog auta kako bi pronašao sponzora koji će reći NALIJEPI.me <br/><br/>
				</p>
				<div id="bezveze">
				
					<a href="#" class="a-btn">
						<span class="a-btn-text">Saznaj više</span> 
						<span class="a-btn-slide-text">nalijepi.ME</span>
						<span class="a-btn-icon-right"><span></span></span>
					</a>
				
							<div id="registriraj">
								
							<a href="#register-box" class="a-btn">
								<span class="a-btn-text">Registriraj se</span> 
								<span class="a-btn-slide-text">Besplatno je</span>
								<span class="a-btn-icon-right"><span></span></span>
								</a>
							</div>
						
					</div>
				</div>
			
			<div id="izdvojeniOglasi">
				<div id = "izdvojeniOglasiNaslov"><h2>IZDVOJENI OGLASI<h2>
				
				</div>
				
				<div id = "izdvojeniOglasiBox">
				
				<div id="izdvojeniOglas1">
                  <div id="slikaIzdvojeniOglasi"><img src="images/mercedes.png" width="120" height="80" alt="" /></div>
                  <div id="izdvojeniOglasiText"> Vozim mercedes koji se nalazi na Vrbiku! U zadnje vrijeme često stoji na parkingu 
				  jer su mi ključevi kod Tome</div>
                </div>
				
				<div id="izdvojeniOglas1">
                  <div id="slikaIzdvojeniOglasi"><img src="images/mercedes.png" width="120" height="80" alt="" /></div>
                  <div id="izdvojeniOglasiText">Uskoro</div>
                </div>
				
				<div id="izdvojeniOglas1">
                  <div id="slikaIzdvojeniOglasi"><img src="images/mercedes.png" width="120" height="80" alt="" /></div>
                  <div id="izdvojeniOglasiText">Uskoro</div>
                </div>
				
				
				
				</div>
				
				
			
			
			</div>
			
		</div>
				<div id="bottomMenu">
					<div id = "pageBottom" href=""></div>
					<div id = "pageBottom" href=""></div>
					
					<a id = "pageBottom" href="">Uvjeti korištenja</a>
					<a id = "pageBottom" href="">Site map</a>
					<div id="kontakt">
					
					<a id = "pageBottom" href="#kontakt-box">Kontakt</a>
				
					</div>
					
					<div id = "pageBottom" href=""></div>
					<div id = "pageBottom" href=""></div>
			
		</div>
		
		
	</div>



</body>
</html>
